<template>
  <view>
    <view class="hhggbxeer row bbm" v-if="tyer == 1">
      <view class="col pd ls fz26 pr mr10" @tap="caidan">
       <uni-icons
          type="search"
          color="#3DADEB"
          size="24"
          class="ls cz"
        ></uni-icons>
        <text class="ml10">{{ formData.fieldTypeId
            ? fieldTypeList.filter((i) => {
                return i.id == formData.fieldTypeId;
              })[0].name
            : "全部" }}</text>
        <image src="../../../../static/img/down.png" class="downxeer"></image>
      </view>
      <view
        class="col pd ls fz26 pr mr10"
        @tap="unitlChange"
      >
        <text class="ml10">{{unityName ? unityName : "选择审批单位" }}</text>
        <image src="../../../../static/img/down.png" class="downxeer"></image>
      </view>
      <view class="col pd ls fz26 pr cen blm">
        <picker mode="date" :value="formData.queryDate" @change="bindDateChange">
          <view class="uni-input">{{ formData.queryDate ? formData.queryDate : "选择日期" }}</view>
        </picker>
        <icon v-if="formData.queryDate" class="cancel-icon" type="cancel" size="20" color="#3DADEB" @tap="bindDateChange('')"/>
      </view>
    </view>
    <view class="hhggbxeer row bbm" v-if="tyer == 2">
      <view class="col pd ls fz26 pr mr10" @tap="caidaneer">
        <uni-icons
          type="search"
          color="#3DADEB"
          size="24"
          class="ls cz"
        ></uni-icons>
        <text class="ml10">{{ 
             formData.result === '' ? '全部' : cdfrrt[formData.result]
        }}</text>
        <image src="../../../../static/img/down.png" class="downxeer"></image>
      </view>
      <view
        class="col pd ls fz26 pr mr10"
        @tap="unitlChange"
      >
        <text class="ml10">{{unityName ? unityName : "选择审批单位" }}</text>
        <image src="../../../../static/img/down.png" class="downxeer"></image>
      </view>
      <view class="col pd ls fz26 pr cen blm">
        <picker mode="date" :value="formData.queryDate" @change="bindDateChange">
          <view class="uni-input">{{ formData.queryDate ? formData.queryDate : "选择日期" }}</view>
        </picker>
        <icon v-if="formData.queryDate" class="cancel-icon" type="cancel" size="20" color="#3DADEB" @tap="bindDateChange('')"/>
      </view>
    </view>
    <uni-popup ref="popup" type="error">
      <uni-popup-message type="error" message="查询的单位不合法"></uni-popup-message>
    </uni-popup>
    <shlist v-if="tyer == 1" :list="list" :fp="true"></shlist>
    <shlist v-if="tyer == 2" :list="list2" :fp="true"></shlist>
  </view>
</template>
<script>
import shlist from "@/pages/gongzuo/components/shlist.vue";
export default {
  props: ["tyer"],
  data() {
    return {
      idxdf: 0,
      datewwer: "",
      xzse: "",
      xzseb: "",
      list: [],
      list2: [],
      fieldTypeList: [],
      formData: {
        fieldTypeId: '',
        result: '',
        unityId:'',
        queryDate: '',
      },
      unityName:'',
      cdfrrt: ["全部",  "通过", "未通过", '已撤销']
    };
  },
  components: {
    shlist,
  },
  watch: {
    tyer() {
      this.getFieldTypeList();
      if (this.tyer == 1) {
        this.applyUnApproval();
      } else if (this.tyer == 2) {
        this.applyApproval();
      }
    },
  },
  methods: {
    async applyUnApproval() {
      let res = await this.$api.unAssignList(this.formData);
      if (res && res.code == 200) {
        this.list = res.data;
      } else {
        this.$refs.popup.open()
      }
    },
    async applyApproval() {
      let res = await this.$api.assignList(this.formData);
      if (res && res.code == 200) {
        this.list2 = res.data;
      } else {
        this.$refs.popup.open()
      }
    },
    bindDateChange(e) {
      if(e === '') {
        this.formData.queryDate = ''
      } else {
        this.formData.queryDate = e.detail.value;
      }
      if (this.tyer == 1) {
        this.applyUnApproval();
      } else if (this.tyer == 2) {
        this.applyApproval();
      }
    },
    call(e) {
      this.idxdf = e;
    },
    async getFieldTypeList() {
      let res = await this.$api.fieldTypeCheck();
      this.fieldTypeList = res.data;
    },
    caidan() {
      let th = this;
      uni.showActionSheet({
        itemList: th.fieldTypeList.map((i) => {
          return i.name;
        }),
        success: function (res) {
          th.formData.fieldTypeId = th.fieldTypeList[res.tapIndex].id;
          th.applyUnApproval();
        },
      });
    },
    caidaneer() {
      let th = this;
      uni.showActionSheet({
        itemList: th.cdfrrt,
        success: function (res) {
           if( res.tapIndex == 0) {
            th.formData.result =  ""
          } else if(res.tapIndex == 3) {
            th.formData.result = 0
          } else {
             th.formData.result = res.tapIndex;
          }
          th.tapIndex = res.tapIndex;
          th.applyApproval();
        },
      });
    },
    unitlChange() {
      let th = this;
      uni.showActionSheet({
        itemList: th.unityList.map((i) => {
          return i.name;
        }),
        success: function (res) {
          th.formData.unityId = th.unityList[res.tapIndex].id;
          th.unityName = th.unityList[res.tapIndex].name
          th.list = [];
          if (th.tyer == 1) {
            th.applyUnApproval();
          } else if (th.tyer == 2) {
            th.applyApproval();
          }
        },
      });
    }
  },
  mounted() {
    this.unityList = [{id: '', name: '全部'}].concat(this.$store.getters.getUserInfo.unityList);
    this.getFieldTypeList();
    if (this.tyer == 1) {
      this.applyUnApproval();
    } else if (this.tyer == 2) {
      this.applyApproval();
    }
  },
};
</script>
<style scoped>
.uni-popup{
  z-index: 9999;
}
</style>
